<div id="addnewuser" class="reveal-modal small" data-reveal data-options="closeOnBackgroundClick:true" style="background:none !important;border:none;box-shadow:none;">
	<div class="row">
	  <div class="small-11 large-12 columns small-centered" style="padding:0;">
	    <div class="alert-panel" data-alert>
	      <div class="alert-panel-title">
	     <label><strong style="color:white !important;">Add New User</strong></label>
	        <a class="alert-panel close">&times;</a>
	      </div>
	      <div class="alert-panel-message">
<form id="frmCreateAccount" data-abide="ajax">
  <div class="row">
    <div class="large-6 columns" style="padding:.2rem;">
      <label>Username
        <input name="username" type="text" required/>
      </label>
      <small class="regerr error" style=""><i class="fa fa-exclamation-circle fa-lg" style="color:#E8877D"></i> Username is required</small>
    </div>
    <div class="large-6 columns" style="padding:.2rem;">
      <label>Email
        <input type="text" name="email" required />
      </label>
      <small class="regerr error" style=""><i class="fa fa-exclamation-circle fa-lg" style="color:#E8877D"></i> Email is required</small>
    </div>
  </div>

    <div class="row">
    <div class="large-6 columns" style="padding:.2rem;">
      <label>Password
        <input id="password" name="password"  type="password" required pattern="[a-zA-Z0-9]{8,}">
      </label>
	  <small class="regerr error" style=""><i class="fa fa-exclamation-circle fa-lg" style="color:#E8877D"></i> Password is required and must have atleast 8 characters</small>
    </div>
    <div class="large-6 columns" style="padding:.2rem;">
      <label>Confirm Password
        <input name="confirm_password"  type="password" placeholder="" required data-equalto="password">
      </label>
      <small class="regerr error" style=""><i class="fa fa-exclamation-circle fa-lg" style="color:#E8877D"></i> Password did not match</small>
    </div>
  </div>

  <div class="row">
    <div class="large-12 columns" style="padding:.2rem;">
      <label>Fullname
        <input type="text" name="fullname" required/>
      </label>
      <small class="regerr error" style=""><i class="fa fa-exclamation-circle fa-lg" style="color:#E8877D"></i> Fullname is required</small>
    </div>
  </div>

  <div class="row">
    <div id ="checkBoxes" class="large-12 columns" style="padding:.2rem;">
      <label>User Action</label>
      <input id="checkbox1" name="approve" type="checkbox"><label for="checkbox1">Approve</label>
      <input id="checkbox2" name="update" type="checkbox"><label for="checkbox2">Update</label>
      <input id="checkbox1" name="delete" type="checkbox"><label for="checkbox1">Delete</label>
      <input id="checkbox2" name="add" type="checkbox"><label for="checkbox2">Add</label>
      <input id="checkbox2" name="modify" type="checkbox"><label for="checkbox2">Modify Account</label>
    </div>
  </div>

    <div class="row">
    <div class="large-12 columns" style="padding:.2rem;">
      <label>Input your password for authorization
        <input id="authorizationPassword" name="authorization_password" type="password" placeholder="Your Password" required/>
      </label>
      <small class="regerr error" style=""><i class="fa fa-exclamation-circle fa-lg" style="color:#E8877D"></i> Authorization Password is required</small>
    </div>
  </div>


</form>
	      </div>
	      <div class="alert-panel-action">
	        <a class="tiny button radius secondary">Cancel</a>
	        <button type="submit" class="tiny button radius success btnCreateAccount">Add</button>
	      </div>
	    </div>
	  </div>
	</div>      
</div>


<div id="edituseradmin" class="reveal-modal large" data-reveal data-options="closeOnBackgroundClick:false" style="background:none !important;border:none;box-shadow:none;">
	<div class="row">
	  <div class="small-11 large-12 columns small-centered" style="padding:0;">
	    <div class="alert-panel" data-alert>
	      <div class="alert-panel-title">
	     <label><strong style="color:white !important;">Gee Zablan</strong></label>
	        <a class="alert-panel close">&times;</a>
	      </div>
	      <div class="alert-panel-message">
			   <div id="checkboxes" class="large-12 columns" style="padding:0;margin:0;">
			      <label style="margin:0 0 .5rem 0;">Check these out</label>
			      <input id="checkbox1" type="checkbox"><label for="checkbox1">Add</label>
			      <input id="checkbox2" type="checkbox"><label for="checkbox2">Approve</label>
			      <input id="checkbox1" type="checkbox"><label for="checkbox1">Update</label>
			      <input id="checkbox2" type="checkbox"><label for="checkbox2">Delete</label>
			    </div>
		  </div>
	      </div>
	      <div class="alert-panel-message" style="margin-top:-2rem;padding:0;">
<div class="adtb medium-12 column" style="padding:0;">
<table class="" cellspacing='0' style="width:100%;">
	<thead>
		<tr>
			<th>120 Transactions</th>
			<th>Actions</th>
			<th>Last logged in</th>
			<th class="text-center">Action</th>
		</tr>
	</thead>
    
	<tbody>
		<tr>
			<td>Company</td>
			<td>Approve 3 Companies</td>
			<td>Details</td>
			<td class="text-center">
				<a class="tiny radius button" style="padding:0.2rem;margin:0;">Edit</a>
                <a class="tiny alert radius button" style="padding:0.2rem;margin:0;">Remove</a>
            </td>
		</tr>
	</tbody>
</table>

<ul class="right connection-pagination pagination">
  <li class="arrow unavailable"><a href="">&laquo;</a></li>
  <li class="current"><a href="">1</a></li>
  <li><a href="">2</a></li>
  <li><a href="">3</a></li>
  <li><a href="">4</a></li>
  <li class="unavailable"><a href="">&hellip;</a></li>
  <li><a href="">12</a></li>
  <li><a href="">13</a></li>
  <li class="arrow"><a href="">&raquo;</a></li>
</ul>
</div>
	      </div>
	      <div class="alert-panel-action">
	        <a class="tiny button radius secondary">Cancel</a>
	        <a class="tiny button radius success btnSaveReview">Save</a>
	      </div>
	    </div>
	  </div>
	</div>      
</div>

<div id="suggest_edit" class="reveal-modal small" data-reveal data-options="closeOnBackgroundClick:false" style="background:none !important;border:none;box-shadow:none;">
	<div class="row">
	  <div class="small-11 large-12 columns small-centered" style="padding:0;">
	    <div class="alert-panel" data-alert>
	      <div class="alert-panel-title" id="my_modal_message">
	        Are you sure you want to delete this?
	        
	      </div>
	      <div class="alert-panel-message">
	        When you click continue you can't undo.
	      </div>
	      <div class="alert-panel-action">
	        <a class="tiny button radius secondary btnCancel">Cancel</a>
	        <a class="tiny button radius success btnContinueSuggest">Continue</a>
	      </div>
	    </div>
	  </div>
	</div>      
</div>

<div id="alertconfirm" class="reveal-modal small" data-reveal data-options="closeOnBackgroundClick:false" style="background:none !important;border:none;box-shadow:none;">
	<div class="row">
	  <div class="small-11 large-12 columns small-centered" style="padding:0;">
	    <div class="alert-panel" data-alert>
	      <div class="alert-panel-title" id="modal_message">
	        Are you sure you want to delete this?
	        
	      </div>
	      <div class="alert-panel-message">
	        When you click continue you can't undo.
	      </div>
	      <div class="alert-panel-action">
	        <a class="tiny button radius secondary btnCancel">Cancel</a>
	        <a class="tiny button radius success btnContinue">Continue</a>
	      </div>
	    </div>
	  </div>
	</div>      
</div>

<div id="activate_deactivate" class="reveal-modal small" data-reveal data-options="closeOnBackgroundClick:true" style="background:none !important;border:none;box-shadow:none;">
	<div class="row">
	  <div class="small-11 large-12 columns small-centered" style="padding:0;">
	    <div class="alert-panel" data-alert>
	      <div class="alert-panel-title modal_message2">
	        Are you sure you want to delete this?
	        
	      </div>
	      <div class="alert-panel-message">
	        When you click continue you can't undo.
	      </div>
	      <div class="alert-panel-action">
	        <a class="tiny button radius secondary btnCancel">Cancel</a>
	        <a class="tiny button radius success btnContinue2">Continue</a>
	      </div>
	    </div>
	  </div>
	</div>      
</div>


<div id="editaction" class="reveal-modal small" data-reveal data-options="closeOnBackgroundClick:true" style="background:none !important;border:none;box-shadow:none;">
	<div class="row">
	  <div class="small-11 large-12 columns small-centered" style="padding:0;">
	    <div class="alert-panel" data-alert>
	      <div class="alert-panel-title">
	     <label><strong style="color:white !important;">Edit Account</strong></label>
	        <a class="alert-panel close">&times;</a>
	      </div>
	      <div class="alert-panel-message">
<form id="frmEditAccount" data-abide="ajax">

  <div class="row">
    <div id ="checkBoxes2" class="large-12 columns" style="padding:.2rem;">
      <label>User Action</label>
      <input id="checkbox1" name="approve" type="checkbox"><label for="checkbox1">Approve</label>
      <input id="checkbox2" name="update" type="checkbox"><label for="checkbox2">Update</label>
      <input id="checkbox1" name="delete" type="checkbox"><label for="checkbox1">Delete</label>
      <input id="checkbox2" name="add" type="checkbox"><label for="checkbox2">Add</label>
      <input id="checkbox2" name="modify" type="checkbox"><label for="checkbox2">Modify Account</label>
    </div>
  </div>

    <div class="row">
    <div class="large-12 columns" style="padding:.2rem;">
      <label>Input your password for authorization
        <input id="authorizationPassword" name="authorization_password" type="password" placeholder="Your Password" required/>
      </label>
      <small class="regerr error" style=""><i class="fa fa-exclamation-circle fa-lg" style="color:#E8877D"></i> Authorization Password is required</small>
    </div>
  </div>


</form>
	      </div>
	      <div class="alert-panel-action">
	        <a class="tiny button radius secondary">Cancel</a>
	        <button type="submit" class="tiny button radius success btnSaveEditAccount">Save</button>
	      </div>
	    </div>
	  </div>
	</div>      
</div>


<script type="text/javascript" src="<?=BASE_URI?>js/admin_js/accounts_function.js"></script>